<template>
  <div class="iframe-container">
    <iframe ref="iframe" :src="'pdf/web/viewer.html?file=' + pdfSrc + '#page=1'" frameborder="0"
      v-if="!isLoading"></iframe>
  </div>
</template>

<script>
export default {
  props: {
    bookInfo: {
      type: Object,
      default: {}
    }
  },
  data() {
    return {
      pdfSrc: this.bookInfo.bookUrl,//  书本
      isLoading: true,
      //pdfSrc: 'http://www.aikeji.top:50005/_uploads/PHOTO/1722507010982.pdf'
      // pdfSrc: 'http://www.aikeji.top:50005/_uploads/PHOTO/1722478028491.pdf'
    };
  },
  mounted() {
    this.isLoading = false
    let that = this
    setTimeout(() => {
      that.setIframeHeight();
      window.addEventListener('resize', that.setIframeHeight);
    }, 500);
   
  },
  methods: {
    setIframeHeight() {
      const iframe = this.$refs.iframe;
      iframe.style.height = window.innerHeight + 'px';
    }
  },
  beforeDestroy() {
    window.removeEventListener('resize', this.setIframeHeight);
  }
};
</script>

<style scoped>
.iframe-container {
  width: 100%;
  height: 100%;
  /* Viewport height */
  overflow: hidden;
}

iframe {
  width: 100%;
  height: 100%;
  border: none;
}
</style>